import React from 'react'
import Add from '@/components/add'

import Test from '@/components/test'
import styles from '@/styles/first.scss'

export default class First extends React.Component {
  constructor() {
    super()
    this.state = {
      CommentList: [
        { id: 1, user: '张三', content: '哈哈，沙发' },
        { id: 2, user: '李四', content: '哈哈，板凳' },
        { id: 3, user: '王五', content: '哈哈，凉席' },
        { id: 4, user: '赵六', content: '哈哈，砖头' },
        { id: 5, user: '田七', content: '哈哈，楼下山炮' }
      ],
    }
  }
  render(){
    return <div>
      <h2 className={styles.title}>我是列表</h2>
      <Add addFn={this.addList}/>

      { this.state.CommentList.map(item => <Test {...item} key={item.id} />) }
    </div>
  }

  addList = (info) => {
    this.state.CommentList.unshift(info)
    this.setState({
      CommentList: this.state.CommentList
    })
  }

}